<link rel="stylesheet" href="/cn/css/exerciseNew/readDetail.css?v=1.3">
<script type="text/javascript" src="/cn/js/jquery.jplayer.min.js"></script>
<script type="text/javascript" src="/cn/js/jq-ui.min.js"></script>
<script type="text/javascript" src="https://file.viplgw.cn/ui/public/lib/vue/vue.js"></script>

<section id="exerciseDetail">
    <!-- 顶部 -->
    <div class="headNav">
        <template>
            <div class="w12 headContent">
                <div class="headTitle">剑雅阅读 {{dataQuestion!=''?dataQuestion.article.name:''}}</div>
                <div class="operateBtn">
                    <a href="/cn/exercise/<?php echo $tmp_name;?>?category=all" class="upData">退出</a>
                    <a :href="'/cn/exercise/read-detail?content_id='+ content_id" class="upData" style="margin-right: 25px;background:#795FC2;color: white">重新练习</a>
                    <img src="/cn/images/exerciseNew/16@2x.png" alt="" class="fullScreen"  @click="launchFullscreen">
                </div>
            </div>
        </template>
    </div>
    <input type="hidden" value="<?php echo $content_id?>" name="content_id" id="content_id">
    <!-- 做题部分 -->
    <div class="exerciseCenter">
        <!-- 文章 -->
        <div class="fullText">
            <a href="javascript:void(0)" class="original" @click="isOriginal = !isOriginal">{{isOriginal?'查看原文':'显示空白'}}</a>
            <div class="articleText" id="articleText">
                <div v-show="!isOriginal" v-html="dataQuestion!=''?dataQuestion.article.description:''"></div>
            </div>
        </div>
        <!-- 题目 -->
        <div class="subject">
            <p class="original">题目</p>
            <template>
                <div class="articleText" v-cloak  >
                    <div class="outDiv" v-for="(item,index) in dataQuestion.topic" :id="item.parent.numbering">
                        <!--单选题  numbering 7  是非判断题 numbering 3  都是单项选择题且表现形式一样-->
                        <div class="" v-if="item.parent.numbering == 7 || item.parent.numbering == 3">
                            <div class="quesTitle">{{item.parent.title}}</div>
                            <div class="quesCnName" v-html="item.parent.cnName"></div>
                            <div class="singleBox ItemIn" v-for="(itemSon,indexSon) in item.son" :id="'listen_'+ itemSon.content_id">
                                <div class="singleTitle">
                                    <div v-html="itemSon.article"></div>
                                    <img class="spin" src="/cn/images/exerciseNew/13@2x.png" alt="" @click="toggle($event)">
                                </div>
                                <div class="singleZt">
                                    <div :class="{'singleFalse':(itemSon.answer != itemSon.my_answer) && (itemSon.my_answer == letterArry[indexSonDes]) ,'rightSingle':letterArry[indexSonDes] == itemSon.answer,'singleCover':true}" v-for="(itemSonDes,indexSonDes) in itemSon.description">
                                        <input :id="itemSon.id+'_'+indexSonDes" disabled type="radio" class="radioBox"
                                               :checked="itemSon.my_answer == letterArry[indexSonDes]"
                                               :value="letterArry[indexSonDes]">
                                        <label :for="itemSon.id+'_'+indexSonDes"><span style="margin-right: 5px;"></span>{{item.parent.numbering == 7?letterArry[indexSonDes]:''}}
                                            {{itemSonDes}}</label>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!--多选题  1-->
                        <div class="" v-if="item.parent.numbering == 1">
                            <div class="quesTitle">{{item.parent.title}}</div>
                            <div class="quesCnName" v-html="item.parent.cnName"></div>
<!--                            <div class="quesArticle" v-html="item.parent.description"></div>-->
                            <div class="singleBox ItemIn" :id="'listen_'+ item.son[0].content_id">
                                <div class="singleTitle">
                                    <div v-html="item.son[0].article"></div>
                                    <img class="spin" src="/cn/images/exerciseNew/13@2x.png" alt="" @click="toggle($event)">
                                </div>
                                <div class="singleZt">
                                    <div :class="{'singleFalse':(item.son[0].my_answer.indexOf(letterArry[indexSonDes])!=-1)&& (item.son[0].answer.indexOf(letterArry[indexSonDes])==-1),'rightSingle':item.son[0].answer.indexOf(letterArry[indexSonDes])!=-1 ,'singleCover':true}" v-for="(itemSonDes,indexSonDes) in item.parent.sentenceNumber">
                                        <input :id="item.son[0].id+'_'+indexSonDes" disabled type="checkbox" class="radioBox"  :checked="item.son[0].my_answer.indexOf(letterArry[indexSonDes])!=-1" :value="letterArry[indexSonDes]">
                                        <label :for="item.son[0].id+'_'+indexSonDes">
                                            <span style="margin-right: 5px;"></span>
                                            {{letterArry[indexSonDes]}}.<a v-html="itemSonDes"></a></label>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!--填空  除开单选和打勾题 全部算填空  首先是正常的填空-->
                        <div class="" v-if="item.parent.numbering == 2">
                            <div class="quesTitle">{{item.parent.title}}</div>
                            <div class="quesCnName" v-html="item.parent.cnName"></div>
                            <div class="quesArticle tableCover" v-html="item.parent.article"></div>
                            <p class="trueAnswerTitle">正确答案:</p>
                            <div class="trueAnswerCover">
                                <p class="trueAnswerItem" v-for="(trueItem,trueIndex) in item.son">{{trueItem.name}}. <span>{{trueItem.answer}}</span></p>
                            </div>
                        </div>
                        <!--heading 题型  大纲拖拽-->
                        <div class="" v-if="item.parent.numbering == 8">
                            <div class="quesTitle">{{item.parent.title}}</div>
                            <div class="quesCnName" v-html="item.parent.cnName"></div>
                            <div class="artiOption" v-for="(itemSentence,indexSentence) in item.parent.sentenceNumber">
                                <p class="headSen">{{itemSentence}}</p>
                            </div>
                            <p class="trueAnswerTitle">正确答案:</p>
                            <div class="trueAnswerCover">
                                <p class="trueAnswerItem" v-for="(trueItem,trueIndex) in item.son">{{trueItem.name}}. <span>{{trueItem.answer}}</span></p>
                            </div>
                        </div>
                        <!--匹配 题型  打勾勾-->
                        <div class="" v-if="item.parent.numbering == 4">
                            <div class="quesTitle">{{item.parent.title}}</div>
                            <div class="quesCnName" v-html="item.parent.cnName"></div>
                            <div class="tickTable">
                                <div class="tickItem">
                                    <p class="tickText"></p>
                                    <div class="chooseText" v-for="(chooseLetter,chooseIndex) in item.parent.article">{{chooseLetter}}</div>
                                </div>
                                <div class="tickItem" v-for="(itemSon,indexSon) in item.son">
                                    <p class="tickText">{{itemSon.article}}</p>
                                    <div :class="{'doFalse':(itemSon.answer != itemSon.my_answer) && (itemSon.my_answer == letterArry[indexSonDes]) ,'rightAnswer':letterArry[indexSonDes] == itemSon.answer,'chooseText tickCover':true}" v-for="(itemSonDes,indexSonDes) in item.parent.article">
                                        <input :id="itemSon.id+'_'+indexSonDes" disabled type="radio" class="radioBox" :value="letterArry[indexSonDes]"  :checked="itemSon.my_answer == letterArry[indexSonDes]">
                                        <label :for="itemSon.id+'_'+indexSonDes"><span></span></label>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!--图片 题型-->
                        <div class="" v-if="item.parent.numbering == 5">
                            <div class="quesTitle">{{item.parent.title}}</div>
                            <div class="quesCnName" v-html="item.parent.cnName"></div>
                            <div class="quesCnName">
                                <img :src="item.parent.image" alt="">
                            </div>
                            <div class="artiOption" v-for="(itemSon,indexSon) in item.son">
                                <input type="text" readonly :value="itemSon.my_answer" :placeholder="itemSon.name" :id="'listen_'+ itemSon.content_id" :class="{'imgInput':true,'doFalse':itemSon.judge == 0,'rightAnswer':itemSon.judge == 1}">
                            </div>
                            <p class="trueAnswerTitle">正确答案:</p>
                            <div class="trueAnswerCover">
                                <p class="trueAnswerItem" v-for="(trueItem,trueIndex) in item.son">{{trueItem.name}}. <span>{{trueItem.answer}}</span></p>
                            </div>
                        </div>
                        <!--选项拖拽 题型-->
                        <div class="" v-if="item.parent.numbering == 6">
                            <div class="quesTitle">{{item.parent.title}}</div>
                            <div class="quesCnName" v-html="item.parent.cnName"></div>
                            <div class="quesCnName" v-html="item.parent.article"></div>
                            <p class="trueAnswerTitle">正确答案:</p>
                            <div class="trueAnswerCover">
                                <p class="trueAnswerItem" v-for="(trueItem,trueIndex) in item.son">{{trueItem.name}}. <span>{{trueItem.answer}}</span></p>
                            </div>
                            <div class="artiOption" v-for="(itemSentence,indexSentence) in item.parent.sentenceNumber">
                                <p class="headSen">{{letterArry[indexSentence]}}. {{itemSentence}}</p>
                            </div>

                        </div>
                    </div>
                </div>
            </template>

        </div>
    </div>
    <!-- 底部按钮 -->
    <div class="footNav">
        <div class="footNavCover">
            <a href="javascript:void(0)" class="reviewBtn" style="visibility: hidden"></a>
            <div class="quesNumCover">
                <!-- quesNum 未做  fulfil已做  doNow 正在做 notSure 不确定review-->
                <a href="javascript:void(0)" :class="{'quesNum':index>-1, 'fulfil': item.isDo == 1, 'notSure': item.status == 1, 'doNow': index == current }" v-for="(item,index) in dataQuestion.question_list" @click="welter(item.pid,item.content_id,index,item.status)" @mouseover="followIn($event)" @mouseout="followOut($event)">{{index+1}}</a>
                <!-- 提示 跟随按钮位置-->
            </div>
            <div class="turnBtn">
                <a href="javascript:void(0)" class="prevBtn" @click="prev()"  v-show="current>0">
                    <img src="/cn/images/exerciseNew/18@2x.png" alt="">
                    <span>上一题</span>
                </a>
                <a href="javascript:void(0)" class="nextBtn" @click="next()"  v-show="dataQuestion!=''&&current<dataQuestion.question_list.length-1">
                    <img src="/cn/images/exerciseNew/19@2x.png" alt="">
                    <span>下一题</span>
                </a>
            </div>
        </div>
    </div>

    <!-- 交卷弹窗 -->
    <div class="carryOut" v-if="confirmPop" v-cloak>
        <div class="carryContent">
            <div class="carryTitle">
                交卷
                <img src="/cn/images/exerciseNew/chacha.png" alt="" class="closeOut" @click="confirmPop = false">
            </div>
            <p class="carryTip">共有试题{{dataQuestion!=''?dataQuestion.question_list.length:''}}题，已做{{doLength}}题。您确定要交卷吗？</p>
            <div class="carryBtn">
                <a href="javascript:void(0)" class="confirmPaper" @click="submitText">确认交卷</a>
                <a href="javascript:void(0)" class="checkBtn" @click="confirmPop = false">再检查一下</a>
            </div>
        </div>
    </div>
</section>




<script src="/cn/js/exerciseReview/readDetail.js?v=1.5.3"></script>


